<template>
	<view class="flex-col page">
		<view class="flex-col section_1">
			<!-- <view class="justify-center group">
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621783633159.png"
					class="image" @click='returnC' />
				<text class="text">订单详情</text>
			</view> -->
			<view class="justify-between group_1" v-if="ordersStatus == 1">
				<view class="flex-col items-start group_2">
					<text class="text_1">订单待付款</text>
					<view class="u-flex text_222">
						<text class="">剩余时间：</text>
						<u-count-down :time="lefttime" format="HH:mm:ss"></u-count-down>
					</view>

				</view>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
			<view class="justify-between group_1" v-else-if="ordersStatus == 2">
				<text class="text_1">订单待完善</text>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
			<view class="justify-between group_1" v-else-if="ordersStatus == 6">
				<text class="text_1">订单已取消</text>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
			<view class="justify-between group_1" v-else-if="ordersStatus == 3">
				<view class="flex-col items-start group_2">
					<text class="text_1">订单进行中</text>
					<text class="text_222">工长与巡检员正在整理巡检进度</text>
				</view>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
			<view class="justify-between group_1" v-else-if="ordersStatus == 4">
				<view class="flex-col items-start group_2">
					<text class="text_1">订单待评价</text>
					<text class="text_222">请对本次服务评价</text>
				</view>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
			<view class="justify-between group_1" v-else-if="ordersStatus == 5">
				<text class="text_1">订单已完成</text>
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836667858104212.png"
					class="image_1" />
			</view>
		</view>
		<view class="text_btn flex-row" :class=" ordersStatus!=1 && ordersStatus!=2 && ordersStatus!=6?'activeT':''"
			v-if="ordersStatus!=1&&ordersStatus!=2 && ordersStatus!=6">
			<view class="text_btn_sg" @click="toxj(0)">施工进度</view>
			<view class="text_btn_xj" @click="toxj(1)">巡检进程</view>
		</view>
		<view class="flex-col section_2" :class="ordersStatus!=1 && ordersStatus!=2 && ordersStatus!=6?'active':''">
			<view class="flex-row">
				<view class="section_3 line-height">
					<!--*-->
				</view>
				<text class="text_2">巡检服务订单</text>
			</view>
			<view class="justify-between group_3">
				<text class="text_3">你的房屋位置</text>
				<text class="text_4">{{listdate.provinceName}}{{listdate.cityName}}{{listdate.districtName}}</text>
			</view>
			<view class="justify-between group_4">
				<text class="text_5">你的房屋面积</text>
				<text class="text_6">{{listdate.roomArea}}m²</text>
			</view>

			<view class="justify-between group_5">
				<text class="text_7">房屋类型</text>
				<text class="text_8">{{listdate.roomTypeName}}</text>
			</view>
			<!-- 新增工长 -->
			<view class="justify-between group_5" v-if="ordersStatus == 5">
				<text class="text_7">工长</text>
				<text class="text_8">{{listdate.foremanName}}{{listdate.foremanId}}</text>
			</view>
		</view>
		<view class="flex-col section_4" v-if="ordersStatus == 2 || ordersStatus == 3">
			<view class="flex-row group_6">
				<view class="section_3">
					<!--*-->
				</view>
				<text class="text_9">完善巡检资料</text>
			</view>
			<view class="flex-col group_9">
				<view class="justify-between u-col-center">
					<view class="flex-col items-start">
						<text class="text_16">定稿施工图完善</text>
						<text class="text_1666">（含每个软装细节）</text>
					</view>
					<text class="text_107 text_179" v-if="listdate.inspection.completePictures == null "
						@click="wanshanSGT(1)">去完善</text>
					<text class="text_17 text_178" @click="wanshanSGT(0)" v-else>再次上传</text>
				</view>
				<view class="justify-between u-col-center lineHeight">
					<view class="flex-col items-start">
						<text class="text_16">主辅材清单完善</text>
					</view>
					<text class="text_17 text_179" @click="wanshan(1)"
						v-if="listdate.inspection.inspectionMaterialList==null">去完善</text>
					<text class="text_17 text_178" @click="wanshan(0)" v-else>再次上传</text>
				</view>
				<view class="justify-between u-col-center">
					<view class="flex-col items-start">
						<text class="text_16">巡检服务类别</text>
						<text class="text_166">{{detailedName}}（{{nums}}次巡检含进度监控）</text>
					</view>
					<text class="text_17">{{price}}元/m²</text>
				</view>
				<view class="flex-col group_13">
					<view class="justify-between">
						<text class="text_18">总额</text>
						<text class="text_19">￥{{listdate.totalMoney}}</text>
					</view>
					<view class="justify-between group_15" v-if="listdate.couponsMoney>0">
						<text class="text_20">优惠券</text>
						<text class="text_21">-￥{{this.listdate.couponsMoney}}</text>
					</view>
					<view class="justify-end group_16">
						<text class="text_22">应付款:</text>
						<view class="group_17">
							<text class="text_23">￥</text>
							<text class="text_24">{{listdate.payableMoney}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="flex-col section_4" v-else>
			<view class="flex-row group_6">
				<view class="section_3">
					<!--*-->
				</view>
				<text class="text_9">巡检服务类别</text>
			</view>
			<view class="flex-col group_9">
				<view class="justify-between group_11">
					<view class="flex-col items-start">
						<text class="text_16">{{detailedName}}（{{nums}}次巡检含进度监控）</text>
					</view>
					<text class="text_17">{{price}}/m²</text>
				</view>
				<view class="flex-col group_13">
					<view class="justify-between totalPrice">
						<text class="text_18">总额</text>
						<text class="text_19">￥{{listdate.totalMoney}}</text>
					</view>
					<!-- <view class="justify-between group_15">
            <text class="text_20">优惠券</text>
            <text class="text_21">-￥{{this.listdate.couponsMoney}}</text>
          </view> -->
					<view class="justify-end group_16">
						<text class="text_22">应付款:</text>
						<view class="group_17">
							<text class="text_23">￥</text>
							<text class="text_24">{{listdate.payableMoney}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 评价信息 -->
		<view class="flex-col section_info" v-if="ordersStatus == 5">
			<view class="flex-row group_18">
				<view class="section_3 view_2">
					<!--*-->
				</view>
				<text style="margin-left: 20rpx;">评价信息</text>
			</view>
			<view class="flex-col group_18">
				<view class="flex-row justify-between PJXX">
					<view class="PJXX_view" v-if="listdate.commentsLevel ==1">非常满意</view>
					<view class="PJXX_view" v-else-if="listdate.commentsLevel ==2">满意</view>
					<view class="PJXX_view" v-else-if="listdate.commentsLevel ==3">一般</view>
					<view class="PJXX_view" v-else='listdate.commentsLevel ==4'>非常满意</view>
					<!-- 时间 -->
					<view class="pingyu">{{listdate.commentsTime}}</view>
				</view>
				<view style="color: #333;font-size: 26rpx;margin: 20rpx 0;">
					{{listdate.commentsDetails}}
				</view>
				<view class="PJXXIMG flex-row u-flex-wrap">
					<view v-for="(demo,j) in commentsPictures" :key="j">
						<image :src="demo" class="evaluation" @click="previe(commentsPictures,j)"></image>
					</view>

				</view>
			</view>
		</view>
		<view class="flex-col section_5">
			<view class="flex-row group_18">
				<view class="section_3 view_2">
					<!--*-->
				</view>
				<text style="margin-left: 20rpx;">订单信息</text>
			</view>
			<view class="flex-col group_19">
				<view class="flex-row justify-between">
					<view class="flex-row">
						<text class="text_25">订单编号</text>
						<text class="text_26">{{listdate.ordersNumber}}</text>
					</view>
					<text class="text_27" @click="copy(listdate.ordersNumber)">复制</text>
				</view>

				<view class="flex-row group_22">
					<text class="text_28">下单时间</text>
					<text class="text_29">{{listdate.ordersTime}}</text>
				</view>
			</view>
			<view class="flex-row group_22" v-if="ordersStatus != 1 || ordersStatus == 2">
				<text class="text_30">付款金额</text>
				<text class="text_31">￥{{listdate.payableMoney}}</text>
			</view>
			<view class="flex-row group_22" v-if="ordersStatus != 1">
				<text class="text_32">支付方式</text>
				<text class="text_33" v-if="listdate.payType ==1">微信支付</text>
				<text class="text_33" v-else>支付宝支付</text>
			</view>
			<view class="flex-row group_22" v-if="ordersStatus != 1">
				<text class="text_34">支付时间</text>
				<text class="text_35">{{listdate.payTime}}</text>
			</view>
		</view>
		<view class="justify-between section_6" v-if="ordersStatus == 1">
			<view class="flex-row group_25">
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621862755728.png"
					class="image_3" />
				<text class="text_36" @click="go('/pages/my/message/kefu')">联系客服</text>
			</view>
			<view class="flex-col items-center text-wrapper_22" @click="cancelT"><text class="text_37">取消订单</text>
			</view>
			<view class="flex-col items-center text-wrapper_21" @click="topay"><text class="text_39">去付款</text></view>
		</view>
		<view class="justify-between section_7" v-else-if="ordersStatus == 2">
			<view class="flex-row group_25">
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621862755728.png"
					class="image_3" />
				<text class="text_36" @click="go('/pages/my/message/kefu')">联系客服</text>
			</view>
			<view class="flex-col items-center text-wrapper_22"
				@click="go('/pages/my/order/contractDuration?id='+listdate.inspection.inspectionId+'&orderid='+ordersId)">
				<text class="text_37">合同工期</text>
			</view>
		</view>
		<view class="justify-between u-col-center section_6 positiFixed" v-else-if="ordersStatus == 3">
			<view class="flex-row group_25">
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621862755728.png"
					class="image_3" />
				<text class="text_36" @click="go('/pages/my/message/kefu')">联系客服</text>
			</view>
			<view class="u-flex">
				<!-- <view class="flex-col items-center text-wrapper_23" @click.stop="go('/pages/my/bill/informationBill?orderid='+ordersId)"><text class="text_37">申请开票</text></view> -->
				<view class="flex-col items-center text-wrapper_23 u-m-r-20" @click="changeorderStatus"><text
						class="text_37">完成订单</text></view>
				<view class="flex-col items-center text-wrapper_21" @click="shareFriend(ordersId)"><text
						class="text_39">分享邀请工长</text></view>
			</view>

		</view>
		<view class="justify-between section_6" v-else-if="ordersStatus == 4">
			<view class="flex-row group_25">
				<image
					src="https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621862755728.png"
					class="image_3" />
				<text class="text_36" @click="go('/pages/my/message/kefu')">联系客服</text>
			</view>
			<view class="flex-col items-center text-wrapper_21" @click="pingjia"><text class="text_39">评价</text></view>
		</view>
		<cancelOrder :show="cancelShow" @close="cancelShow = false" @confirm="confirm"></cancelOrder>
		<shop-share v-model="show"></shop-share>
	</view>
</template>

<script>
	import cancelOrder from "@/pages/my/order/cancelOrder.vue"
	import {
		mapGetters
	} from 'vuex'
	export default {
		components: {
			cancelOrder
		},
		data() {
			return {
				cancelShow: false, //取消弹窗
				ordersId: '',
				listdate: '',
				ordersStatus: '',
				commentsPictures: '',
				show: false,
				detailedName: '',
				nums: '',
				price: '',
				lefttime: 0
			};
		},

		onLoad(option) {
			// console.log(option)
			this.ordersId = option.ordersId;

		},
		onShow() {
			this.init();

		},
		created() {

		},
		computed: {
			...mapGetters(['userInfo'])
		},
		onPullDownRefresh() {
			console.log('rrrr');
			this.init();
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			
			previe(url,i) {
				// 图片放大
				uni.previewImage({
					urls:url,
					current:i,
					longPressActions: {
						
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				})
			},
			cancelT() {
				this.cancelShow = true
			},
			confirm(v) {
				// 取消弹窗
				this.$http('mine.cancelOrdersL', {
					ordersId: this.ordersId,
					cancelReason: v
				}).then(r => {
					console.log(r);
					if (r.code = 200) {
						// this.orders.splice(this.currentIndex, 1)
						this.cancelShow = false;
						setTimeout(() => {
							this.$u.toast(r.msg);
						})
						uni.navigateBack({
							delta: 1
						})
						this.getEX()
					}
				});
			},
			init() {
				this.getEX();
			},
			copy(number) {

				uni.setClipboardData({
					data: number,
					success: (result) => {
						this.$u.toast('复制成功');
					},
					fail: (error) => {
						this.$u.toast('网络出错');
					}
				})
			},
			shareFriend(orderid) {

				// #ifdef APP-PLUS
				this.show = true;
				console.log(222);
				this.$store.commit('shareInfo', {
					title: '邀请工长',
					path: this.$WEB_URL + 'pages/index/sharereg?ordersId=' + orderid,
					image: this.$IMG_URL + 'login/logo.png'

				});

				// #endif
				// #ifdef H5
				uni.navigateTo({
					url: 'pages/index/sharereg?ordersId=' + orderid
				})
				// #endif
			},
			wanshanSGT(index) {
				// console.log(index)
				if (index == 0) {
					// console.log('1111')
					this.go('/pages/my/order/picturePerfect?id=' + this.listdate.inspection.inspectionId + '&state=' + 0 +
						'&ordersId=' + this.ordersId)
				} else {
					// console.log('2222')
					this.go('/pages/my/order/picturePerfect?id=' + this.listdate.inspection.inspectionId + '&ordersId=' +
						this.ordersId)
				}
			},
			wanshan(index) {
				if (index == 0) {
					this.go('/pages/my/order/perfectDataXJ?id=' + this.listdate.inspection.inspectionId + '&state=' + 0 +
						'&ordersId=' + this.ordersId)
				} else {
					this.go('/pages/my/order/perfectDataXJ?id=' + this.listdate.inspection.inspectionId + '&ordersId=' +
						this.ordersId)
				}

			},
			toxj(index) {
				if (index == 0) {
					uni.setStorageSync('xunjianorderid', this.ordersId)
					this.go('/pages/my/process/tabs?orderid=' + this.ordersId + "&source=order")
				} else {
					this.go('/pages/index/check/checkProgress?orderid=' + this.ordersId)
				}

			},
			pingjia() {
				this.go('/pages/my/evaluate/evaluate?ordersId=' + this.ordersId)
			},
			// 完成订单
			changeorderStatus() {
				this.$http('mine.updateOrdersStatus', {
					ordersId: this.ordersId,
					ordersStatus: '4'
				}).then(res => {
					if (res.code == 200) {
						this.evaluate(item)
						// 点击完成跳转至订单完成页面
						this.go('/pages/my/order/order.vue')
					}
				}).catch(err => {

				})
			},
			// // 取消订单
			// async cancelT() {
			// 	// uni.navigateTo({
			// 	// 	url: '/pages/my/order/cancelOrder?ordersId=' + this.ordersId
			// 	// })
			// 	const {
			// 		code,
			// 		msg
			// 	} = await this.$http(`mine.cancelOrdersL`, {
			// 		ordersId: this.ordersId
			// 	})
			// 	if (code === 200) {
			// 		this.$u.toast(msg)
			// 	} else {
			// 		this.$u.toast('取消失败,稍后重试')
			// 	}

			// },
			// 支付
			topay() {
				this.go('/pages/pay/pay?orderid=' + this.ordersId);
			},
			returnC() {
				// this.go('/pages/my/order/order')
				uni.navigateBack({
					delta: 1
				})
			},
			getEX() {
				this.$http('mine.ordersEXL', {
					ordersId: this.ordersId
				}).then(res => {
					if (res.code == 200) {
						console.log('tianjia', res)
						// console.log(res.data,'巡检订单详情');
						this.listdate = res.data;
						console.log(this.listdate, '巡检订单详情')
						this.detailedName = res.data.inspection.detailedName;
						this.ordersStatus = res.data.ordersStatus;
						this.price = res.data.inspection.price;
						this.nums = res.data.inspection.nums;
						this.lefttime = this.timeProcessing(res.data.ordersTime);
						console.log(res.data);
						if (this.listdate.commentsPictures) {
							this.commentsPictures = this.listdate.commentsPictures.split(',');

						}
					}
				}).catch(err => {

				})
			},
			timeProcessing(e) {
				let timeDate = e;
				let Time = new Date(timeDate);
				let timestemp1 = Time.getTime();
				let timestamp2 = new Date().getTime();

				return timestemp1 + 86400000 - timestamp2;
			},
		},
	};
</script>

<style scoped lang="scss">
	.totalPrice {
		padding-top: 10rpx;
	}

	.evaluation {
		padding: 10rpx 0;
	}

	.PJXX {
		color: #333;
		font-size: 30rpx;
	}

	.u-flex-wrap {
		justify-content: space-between;
	}

	.PJXX .PJXX_view {
		border: 1px solid #1d6aff;
		color: #1d6aff;
		background-color: rgba(29, 105, 255, 0.2);
		padding: 10rpx 20rpx;
		border-radius: 36rpx;
	}

	.pingyu {
		padding-right: 30rpx;
		font-size: 28rpx;
		color: #333;
	}

	.PJXXIMG view {

		width: 200rpx;
		height: 140rpx;
	}

	.PJXXIMG view image {
		width: 100%;
		height: 100%;
	}

	.text-wrapper_22 {
		// padding: 7px 0 11px;
		background-color: #eee;
		border-radius: 16px;
		width: 86px;
		height: 64rpx;
		line-height: 64rpx;
		margin-left: 100rpx;

	}

	.text-wrapper_23 {
		// padding: 7px 0 11px;
		background-color: #eee;
		border-radius: 16px;
		width: 86px;
		height: 56rpx;
		line-height: 56rpx;
	}

	.text-wrapper_22 .text_35 {
		color: #333;
	}

	.text-wrapper_21 {

		background-color: #1d6aff;
		border-radius: 16px;
		width: 86px;
		padding: 0 15rpx;
		height: 56rpx;
		line-height: 56rpx;
	}

	::v-deep .u-count-down__text {
		color: #D3F9FF;
		font-size: 28rpx;
	}

	.text_35 {
		color: #fff;
		font-size: 25rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_222 {
		color: #ffffff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_btn {
		padding: 30rpx 22rpx 40rpx 24rpx;
	}

	.activeT {
		margin: -109rpx 24rpx 0;
	}

	.active {
		margin: 0 30rpx !important;
	}

	.text_btn_sg {
		text-align: center;
		padding: 32rpx 0 44rpx;
		flex: 1 1 330rpx;
		background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 28.95%, #e0eafd 100%, #e0eafd 100%);
		border-radius: 16rpx;
		height: 114rpx;
		color: #1d6aff;
	}

	.text_btn_xj {
		text-align: center;
		margin-left: 18rpx;
		padding: 32rpx 0 44rpx;
		flex: 1 1 330rpx;
		background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 32.93%, #ebe8ff 100%, #ebe8ff 100%);
		border-radius: 16rpx;
		height: 114rpx;
		color: #381cc6;
	}

	.section_3 {
		margin-top: 8rpx;
		background-color: #1d6aff;
		border-radius: 3rpx;
		width: 6rpx;
		height: 28rpx;
	}

	.page {
		background-color: #f6f7f9ff;
		height: 100%;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
	}

	.section_1 {
		padding: 55rpx 24.5rpx 143rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836621628592893.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.section_2 {
		margin: -109rpx 24rpx 0;
		padding: 30rpx 22rpx 40rpx 24rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
		position: relative;
	}

	.section_4 {
		margin: 21rpx 24rpx 0;
		padding: 0 22rpx 31rpx 24rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
	}

	.section_5 {
		margin: 20rpx 24rpx 0;
		padding: 0 24rpx 34rpx;
		background-color: #ffffff;
		border-radius: 16rpx;
		margin-bottom: 130rpx;
	}

	.section_info {
		padding: 0 22rpx 30rpx 24rpx;
		/* margin-top: 32rpx; */
		margin: 20rpx 24rpx 0;
		background-color: #ffffff;
		box-shadow: 0px -1rpx 0px 0px #eeeeee;
	}

	.section_6 {
		// margin-top: 32rpx;
		padding: 18rpx 24rpx 18rpx 34rpx;
		background-color: #ffffff;
		box-shadow: 0px -1rpx 0px 0px #eeeeee;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}

	.section_7 {
		margin-top: 32rpx;
		padding: 18rpx 24rpx 18rpx 34rpx;
		background-color: #ffffff;
		box-shadow: 0px -1rpx 0px 0px #eeeeee;
		position: fixed;
		bottom: -8rpx;
		left: 0;
		right: 0;
	}

	.group {
		padding: 0 7.5rpx 4rpx;
		position: relative;
	}

	.group_1 {
		margin-top: 43rpx;
	}

	.group_3 {
		margin-top: 38rpx;
	}

	.group_4 {
		margin-top: 31rpx;
	}

	.group_5 {
		margin-top: 25rpx;
	}

	.group_6 {
		padding: 29rpx 4rpx 32rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.group_7 {
		padding-top: 23rpx;
	}

	.group_9 {
		/* margin-top: 46rpx; */
	}

	.group_18 {
		padding: 28rpx 0 32rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.group_19 {
		margin-top: 29rpx;
	}

	.group_22 {
		margin-top: 31rpx;
	}

	.group_23 {
		margin-top: 31rpx;
	}

	.group_24 {
		margin-top: 37rpx;
	}

	.group_25 {
		align-self: center;
	}

	.text-wrapper_2 {
		padding: 14rpx 0 22rpx;
		background-color: #f6f7f9;
		border-radius: 32rpx;
		width: 172rpx;
		height: 64rpx;
	}

	.image {
		position: absolute;
		left: 7.5rpx;
		bottom: 0;
		width: 19rpx;
		height: 36rpx;
	}

	.text {
		color: #ffffff;
		font-size: 36rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_1 {
		color: #ffffff;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';

	}

	.image_1 {
		margin-right: 40.5rpx;
		margin-top: 6rpx;
		filter: drop-shadow(0px 3rpx 3rpx #1a60e266);
		width: 70rpx;
		height: 80rpx;
	}

	.text_2 {
		margin-left: 18rpx;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_3 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_4 {
		margin-right: 3rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_5 {
		margin-bottom: 6rpx;
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_6 {
		margin-top: 6rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_7 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_8 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_9 {
		margin-left: 18rpx;
		color: #333333;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text-wrapper {
		margin-top: 25rpx;
		padding: 2rpx 0 12rpx;
		border-radius: 28rpx;
		background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557836636771255872.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 120rpx;
		height: 40rpx;
	}

	.group_11 {
		margin-top: 20rpx;
	}

	.group_13 {
		margin-top: 39rpx;
		padding-top: 31rpx;
		border-top: solid 1rpx #eeeeee;
	}

	.view_2 {
		margin-top: 8rpx;
	}

	.image_2 {
		margin-left: 17rpx;
		width: 132rpx;
		height: 40rpx;
	}

	.text_27 {

		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.group_21 {
		margin-top: 9rpx;
	}

	.text_30 {
		margin-bottom: 6rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_31 {
		margin-left: 40rpx;
		color: #fe641a;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_32 {
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_33 {
		margin-left: 40rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_34 {
		margin-bottom: 6rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_35 {
		margin-left: 40rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.image_3 {
		flex-shrink: 0;
		width: 36rpx;
		height: 35rpx;
	}

	.text_36 {
		margin-left: 18rpx;
		margin-bottom: 8.5rpx;
		color: #191919;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_37 {
		// width: 100%;
		// height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_39 {
		color: #fff;
		font-size: 24rpx;

	}

	.text_10 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_11 {
		margin-top: 18rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_12 {
		color: #1d6aff;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_13 {
		margin-bottom: 9rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text-wrapper_1 {
		padding: 2rpx 0 12rpx;
		background-color: #1d6aff;
		border-radius: 20rpx;
		width: 114rpx;
		height: 40rpx;
	}

	.text_17 {
		margin-top: 16rpx;
		color: #fe641a;
		font-size: 28rpx;
		// line-height: 28rpx;
		// font-family: '.AppleSystemUIFont';

	}

	.text_177 {
		border-radius: 28rpx;
		background-color: #1d6aff;
		color: #fff;
		padding: 10rpx 20rpx;
	}

	.text_179 {
		border-radius: 28rpx;
		background-color: #1d6aff;
		color: #fff;
		padding: 0 20rpx;
		font-size: 24rpx;
		height: 40rpx;
		line-height: 40rpx;

	}

	.text_178 {
		border: 1px solid #1d6aff;
		color: #1d6aff;
		border-radius: 28rpx;
		background-color: rgba(29, 26, 255, 0.1);
		padding: 0rpx 10rpx;
		font-size: 22rpx;

	}

	.group_15 {
		margin-top: 33rpx;
	}

	.group_16 {
		margin-top: 34rpx;
		padding-top: 27rpx;
		border-top: solid 1rpx #eeeeee;
	}

	.text_25 {
		margin-bottom: 6rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_26 {
		margin-left: 40rpx;

		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_28 {
		margin-bottom: 6rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_29 {
		margin-left: 40rpx;

		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_14 {
		color: #ffffff;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_15 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_16 {
		margin-top: 18rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_1666 {
		margin-left: -16rpx;
		margin-top: 18rpx;
		color: #999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_166 {
		margin-top: 18rpx;
		color: #999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_18 {
		// margin-bottom: 6rpx;
		color: #999999;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_19 {
		// margin-top: 6rpx;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_20 {
		margin-bottom: 6rpx;
		color: #999999;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_21 {
		margin-top: 6rpx;
		color: #191919;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_22 {
		margin-right: 16rpx;
		margin-top: 7rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';

	}

	.group_17 {
		height: 38rpx;
	}

	.text_23 {
		color: #fe641a;
		font-size: 20rpx;
		font-family: '.AppleSystemUIFont';

	}

	.text_24 {
		color: #fe641a;
		font-size: 32rpx;
		font-family: '.AppleSystemUIFont';

	}
</style>
